<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <base href="{$Think.const.BASE_PATH}">
    <title>影片管理</title>
    <!--引入头部meta文件 -->
    {include file="./application/index/view/index/head_meta.html" /}
    <!--引入头部link(css)文件 -->
    {include file="./application/index/view/index/head_link.html" /}
    <!--引入头部script文件 -->
    {include file="./application/index/view/index/head_script.html" /}

    <!--=====================CSS_Link===========================-->
    <link href="public/static/css/manager/film_list.css?v={$Think.const.NOW_TIME}" type="text/css" rel="stylesheet" />
    <link href="public/static/css/common/page.css?v={$Think.const.NOW_TIME}" type="text/css" rel="stylesheet" />
    <!--=====================JS_Link===========================-->
    <!--导航-->
    <script>
        $(function () {
            /**影片删除*/
            $(".film-delete").click(function () {
                if(confirm("是否删除该影片？")){
                    var film_id = $(this).attr("film_id");
                    $.ajax({
                        type: "post",
                        url: "{:url('manager/delFilm')}",
                        cache: false,
                        data: "film_id=" + film_id,
                        dataType: 'json',  //接受数据格式
                        success: function (rs) {
                            var data = rs;
                            if (data.code == "1") {
                                alert("删除成功!");
                                location.reload();
                            } else {
                                alert("删除失败!");
                            }
                        },
                        error: function () {
                            alert("系统繁忙!");
                        }
                    });
                }
            });


            /**删除按钮显示*/
            $(".film-list li").mouseenter(function () {
                $(this).find(".film-delete").css("display","inline-block");
            });

            $(".film-list li").mouseleave(function () {
                $(this).find(".film-delete").css("display","none");
            });

            var w = $(".film-list").width()/8;
            $(".film-list li").width(w-6);
        })
        window.onresize = function () {
            var w = $(".film-list").width()/8;
            $(".film-list li").width(w-6);
        }
    </script>
    <!--导航-->
</head>
<body>
{include file="manager/menu"/}
<div class="container">
    <div class="row">
        <div class="col-sm-3">
            <div class="row">
                <!--引入导航html文件 -->
                {include file="manager/navigate"/}
            </div>
        </div>
        <div class="col-sm-9">
            <div class="row">
                <a class="film-add" href="{:url('manager/film')}" >添加+</a>
            </div>
            <div class="row">
                <div class="form-control">
                    <form action="{:url('manager/film_list')}" method="post">
                        <input class="search-input" type="search" name="name" value="{$name}" autocomplete="off" placeholder="请输入影片名称"/>
                    </form>
                </div>
                <div style="width:100%;margin: 3px auto;">
                    <ul class="film-list">
                        {volist name="filmList" id="list"}
                        <li>
                            <div class="film-delete" film_id = {$list.id}>X</div>
                            <a href="{:url('manager/film','film_id='.$list.id)}">
                                <div title="{$list.name}"><img src="{$list.image}"></div>
                            </a>
                            <div class="film-info">
                                <a href="{:url('manager/film','film_id='.$list.id)}" title="{$list.name}">{$list.name}</a>
                                <p>{$list.onDecade}-{$list.typeName}</p>
                            </div>
                        </li>
                        {/volist}
                    </ul>
                </div>
                <div style="text-align: right;">{$filmList->render()}</div>
            </div>
        </div>
    </div>
</div>
</body>
</html>